<template>
  <div>
    <BaseModal @onClose="onClose(data.id)" @onSubmit="onSubmit" :show="show" title="编辑管理员">
      <div class="demo-input-suffix">
        <span class="form-input-label">用户名：</span>
        <el-input v-model="data.username" placeholder="请输入用户名"></el-input>
      </div>
      <div class="demo-input-suffix">
        <span class="form-input-label">手机号：</span>
        <el-input v-model="data.phone" placeholder="请输入手机号"></el-input>
      </div>
      <div class="demo-input-suffix">
        <span class="form-input-label">邮箱：</span>
        <el-input v-model="data.email" placeholder="请输入邮箱"></el-input>
      </div>
      <div class="demo-input-suffix">
        <span class="form-input-label">性别：</span>
        <el-select v-model="data.sex" placeholder="请选择性别">
          <el-option
            v-for="item in sexes"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="demo-input-suffix">
        <span class="form-input-label">用户状态：</span>
        <el-select v-model="data.user_status" placeholder="请选择用户状态">
          <el-option
            v-for="item in user_status"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
    </BaseModal>
  </div>
</template>
<script>
import modalClose from "@/mixins/modalClose";
import { adminModel } from "@/api/admin_models";
import {Message} from "element-ui";
import CreateFilter from '@/mixins/CreateFilter.js'
export default {
  mixins: [modalClose, CreateFilter],
  components: {},
  data() {
    return {
      data: {
        username: null,
        phone: null,
        email: null,
        sex: null,
        user_status: null,
      }
    };
  },
  props: {
    obj: {
      type: Object,
      default: null
    }
  },
  watch: {
    obj: function(value) {
      if(value) {
        adminModel.item(value.id, res => {
          this.data = res.data;
        })
      }else{
        this.data = {}
      }
    }
  },
  mounted() {},
  methods: {
    onClose(id) {
      if(!id) {
        this.data = {}
      }
      this.$emit("onClose");
    },
    onSubmit() {
      let d = this.data;
      if (
        !d.username ||
        !d.phone ||
        !d.email ||
        !d.sex ||
        !d.user_status
      ) {
        return Message.warning("请填完整信息");
      }

      var regex = /^1[3-9]\d{9}$/;
      if(!regex.test(d.phone)) {
         return Message.warning("请填写正确格式的手机号");
      }
      var regex2 = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;
      if(!regex2.test(d.email)) {
        return Message.warning("请填写正确格式的邮箱");
      }
      if(d.id) {
        adminModel.update(d.id, {
          username: d.username,
          phone: d.phone,
          email: d.email,
          sex: d.sex,
          user_status: d.user_status,
        }, res => {
          Message.success(res.message)
          console.log(this.data)
          this.onClose(d.id)
          this.$emit('afterSubmit')
        }, err => {
          // Message.error(err.message)
        })
      }else{
        adminModel.create(d, res => {
          Message.success(res.message)
          this.onClose(d.id)
          this.$emit('afterSubmit')
        }, err => {
          // Message.error(err.message)
        })
      }
    }
  }
};
</script>
<style lang="scss">
</style>